<template>
  <nav-bar title="修改下载路径" left-text="" left-arrow @click-left="onClickLeft" />
  <div class="down">
    <p>总容量：15.6G <icon name="passed" style="color:green" /></p>
    <div class="inp"><input type="text"><input type="text"></div>
    <span>
      可用容量：14.8G
    </span>
  </div>
</template>
<script setup>
import { useRouter } from "vue-router";
import { NavBar,Icon } from 'vant';
const router = useRouter();
const onClickLeft=()=>{
router.go(-1)
};
</script>
<style scoped>
.down{
  border-top: 5px solid rgb(240,243,248);
  padding: 8px 20px;
  box-sizing: border-box;
}
.down p{
  font-size: .7rem;
  line-height:3vh;
  color: gray;
}
.down span{
  float: right;
  font-size: .7rem;
  color: gray;

}
.down p .van-icon{
  float: right;
  color: green;
}
.inp{
  width: 100%;
  margin: 0 auto;
  height: 5vh;
  /* background-color: red; */
}
.inp input:nth-child(1){
  width: 5%;
  border: 0.1333vw solid var(--main-color);
  background-color: var(--main-color);
  border-radius: 1.3333vw 0 0 1.3333vw;
  /* margin-left:25px; */
}
.inp input:nth-child(2){
  border-radius:  0 1.3333vw 1.3333vw 0;
  border: 0.1333vw solid var(--main-color);
  width: 93%;
}
</style>